<template>
  <div>
    <el-dialog title="充值vip套餐"" :visible.sync="dialogFormVisible" width="600px">
      <el-form :model="form">
        <el-form-item label="vip套餐" :label-width="formLabelWidth">
          <el-select v-model="form.vippackageid" placeholder="请选择vip套餐">
            <el-option
              v-for="a in reqCategory1"
              :key="a.id"
              :label="a.name"
              :value="a.id"
            ></el-option>
          </el-select>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogFormVisible = false">取 消</el-button>
        <el-button type="primary" @click="quedingtianjia()">确 定</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import { getvippackagelist } from "@/api/vippackage";
import { postuservip } from "@/api/dingdan";
export default {
  data() {
    return {
      dialogFormVisible: false,
      form: {
        id: "",
        vippackageid: "",
      },
      formLabelWidth: "120px",
      reqCategory1: [],
    };
  },
  methods: {
    add(val) {
      this.dialogFormVisible = true;
      this.getvippackagelist1();
      this.form.id = val.id;
    },
    // 关闭
    handleClose() {
      this.dialogFormVisible = false;
      this.$emit("refresh");
    },
    async getvippackagelist1() {
      let result = await getvippackagelist();
      console.log(result);
      if (result.code == 0) {
        this.reqCategory1 = result.data;
      }
    },
    async quedingtianjia() {
      if (this.form.vippackageid == "") {
        return;
      }
      let param = {
        id: parseInt(this.form.id),
        vippackageid: parseInt(this.form.vippackageid),
      };
      let result = await postuservip(param);
      if (result.code == 0) {
        this.$message({
          showClose: true,
          message: "充值套餐成功",
          type: "success",
        });
        this.handleClose();
      }
      // console.log(result);
    },
  },
};
</script>
